<script lang="ts" setup name="Home">
import { useSpeechSynthesis } from '/@/hooks/useSpeechSynthesis'

const { speak, cancel, speaking } = useSpeechSynthesis()

const text = ref('你好，这是语音合成。')
</script>

<template>
  <div class="auto-height-container auto-height-container main-box">
    <div>
      <input v-model="text" />
      <button
        @click="speak('Я хочу сказать что-то длинное, но не знаю, как это описать Мне одиноко. Ты можешь мне помочь Хочу спать', 'ru-RU')"
      >
        朗读
      </button>
      <button @click="cancel">停止</button>
      <p v-if="speaking">正在朗读中...</p>
    </div>
  </div>
</template>

<style lang="scss" scoped>
.layoutBox {
  height: 100%;
}
</style>
